
import React, {Component} from 'react';

/**
 * constructor 与 state 有什么区别
 */
export default class LifeCycle extends Component {
  // constructor (props) {
  //   super(props);
  //   this.state = {}
  // }

  state = {
    count: 0
  };

  componentWillMount () {
    console.log('Will Mount: ------------------>');
  }

  componentDidMount() {
    console.log('Did Mount: -------------------->');
  }

  componentWillReceiveProps(nextProps, nextContext) {
    console.groupCollapsed('Will Receive Props: ------------------->');
    console.log('nextProps: ', nextProps);
    console.log('nextContext: ', nextContext);
    console.groupEnd();
  }

  shouldComponentUpdate(nextProps, nextState, nextContext) {
    console.groupCollapsed('should Update: --------------->');
    console.log('nextProps: ', nextProps);
    console.log("nextState: ", nextState);
    console.log('nextContext: ', nextContext);
    console.groupEnd();

    return true
  }

  componentWillUpdate(nextProps, nextState, nextContext) {
    console.groupCollapsed('Will Update: ------->');
    console.groupEnd();
  }

  componentDidUpdate(prevProps, prevState, snapshot) {
    console.groupCollapsed('Did Update: -------->');
    console.groupEnd();
  }


  render () {
    return (
      <>
        <p>{this.props.name}</p>
      </>
    )
  }
}
